Plain functions that became React's primary way to build components.
Function components are simpler by construction — no this, no constructor, no binding gymnastics. Before Hooks (React 16.8), they were limited to purely presentational, 'stateless' components, since there was no way for a plain function to hold state across renders or hook into lifecycle events. Hooks removed that limitation entirely, which is why function components are now the default.
One subtlety worth understanding deeply: each render of a function component is its own independent closure, capturing its own snapshot of that render's props and state. This is the root of the 'stale closure' bug — an event handler or effect defined in one render can end up referencing an outdated variable from that render's closure if it's still around when a later render happens, rather than automatically seeing the latest value the way a class component's this.state always would.
What you'll walk away knowing